<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>角色列表</title>
    <link href="__PUBLIC__/layui/css/layui.css" rel="stylesheet" />
    <link rel="stylesheet" href="__PUBLIC__/css/global.css" media="all">
    <link href="__PUBLIC__/Font-Awesome/css/font-awesome.css" rel="stylesheet" />
    <style>
        .admin-table-page {position: fixed;z-index: 19940201;bottom: 0;width: 100%;background-color: #eee;border-bottom: 1px solid #ddd;left: 0px;}
        .admin-table-page .page{padding-left:20px;}
        .admin-table-page .page .layui-laypage {margin: 6px 0 0 0;}
    </style>
</head>
    <body>
    <div class="admin-main">
        <form class="layui-form" action="">
        <blockquote class="layui-elem-quote">
            <button  class="layui-btn layui-btn-small add" type="button">
                <i class="layui-icon">&#xe608;</i> 添加角色
            </button>
        </blockquote>
        <fieldset class="layui-elem-field">
            <legend>角色列表</legend>
            <div class="layui-field-box">
                <table class="layui-table">
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>角色名称</th>
                        <th>权限列表</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody id="listcontent">
                    </tbody>
                </table>
            </div>
        </fieldset>
        <div class="admin-table-page">
            <div id="page" class="page">
            </div>
        </div>
        </form>
    </div>
    <script id="demo" type="text/html">
        <tr>
            <td>{{d.group_id}}</td>
            <td>{{d.group_name}}</td>
            <td>
                <a href="{{d.url}}?role_id={{d.group_id}}&type=0" class="layui-btn layui-btn-mini rule">查看</a>
            </td>
            <td>
                <a href="{{d.url}}?role_id={{d.group_id}}&type=1" class="layui-btn layui-btn-mini rule"><i class="layui-icon">&#xe608;</i>分配权限</a>
                <a data="{{d.group_id}}" class="layui-btn layui-btn-mini layui-btn-normal edit"><i class="layui-icon">&#xe642;</i>编辑</a>
                {{# if(d.group_id != 1 && d.group_id != 2 && d.group_id != 3){}}
                <a  data="{{d.group_id}}" class="layui-btn layui-btn-danger layui-btn-mini del"><i class="layui-icon">&#xe640;</i>删除</a>
                {{# } }}
            </td>
        </tr>
    </script>
    <script type="text/javascript" src="__PUBLIC__/layui/layui.js"></script>
    <script>
        var layer,form,$;
        var tplurl='{:U(\'Admin/System/ruleGroup\')}'
        layui.use(['layer','form','laypage','laytpl'], function() {
            var laypage = layui.laypage,laytpl = layui.laytpl;
            $ = layui.jquery;
            form = layui.form();
            var pagelistdate;
            var curr;
            laypage({
                cont: 'page',
                pages: {$page} //总页数
                ,
                groups: 5 //连续显示分页数
                ,
                jump: function(obj, first) {
                    curr = obj.curr;
                    listcontent.innerHTML='';
                    $.ajax({
                        type: "GET",
                        url: "__SELF__",
                        data: {p:curr},
                        async: false,
                        success: function(date){
                            if(date['code']==101) {
                                pagelistdate=date.data;
                                layui.each(date.data,function(k,v){
                                    v.url=tplurl;
                                    var getTpl = demo.innerHTML;
                                    laytpl(getTpl).render(v, function(html){
                                        listcontent.innerHTML += html;
                                    });
                                });
                            }else{
                                listcontent.innerHTML='';
                            }
                        }
                    });
                    caozuo();
                }
            });

            //列表操作
            function caozuo(){
                $('.edit').click(function(){
                    var id = $(this).attr('data');
                    console.log(id);
                    var url = "{:U('System/roleAdd')}";

                    $.get(url,{id:id},function(data){
                        if(data.status == 'error'){
                            layer.msg(data.msg,{icon: 5});
                            return;
                        }

                        layer.open({
                            title:'编辑角色',
                            type: 1,
                            skin: 'layui-layer-rim',
                            area: ['500px'],
                            content: data,
                        });
                    });
                });
                $('.del').click(function(){
                    var id = $(this).attr('data');
                    var url = "{:U('AuthGroup/deleteGroup')}";
                    layer.confirm('确定删除吗?', {
                        icon: 3,
                        skin: 'layer-ext-moon',
                        btn: ['确认','取消']
                    }, function(){
                        $.post(url,{id:id},function(data){
                            if(data.status=='error'){
                                layer.msg(data.msg,{icon: 5});
                                return;
                            }else{
                                layer.msg(data.msg, {
                                    icon: 6,
                                    time: 2000
                                }, function(){
                                    window.location.reload();
                                });
                            }
                        });
                    });
                });
            }
            $('.add').click(function(){
                var url = "{:U('System/roleAdd')}";
                $.get(url,function(data){
                    if(data.status == 'error'){
                        layer.msg(data.msg,{icon: 5});
                        return;
                    }

                    layer.open({
                        title:'添加角色',
                        type: 1,
                        skin: 'layui-layer-rim',
                        area: ['500px'],
                        content: data,
                    });
                });
            });
        });
    </script>
    </body>

</html>